<template>
  <el-dialog
      v-model="dialogVisible"
      width="500"
  >
    <div style="font-weight: 600; font-size: 2vh">
      该操作无法撤回,确认删除?
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="danger" @click="del">
          确认
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import {ElDialog, ElMessage} from "element-plus"
import {ref} from "vue"
import {delPro} from "@/api/Project"

let currentId
const dialogVisible = ref(false)

const emits = defineEmits(['reloadList'])

const showDel = (id) => {
  currentId = id
  dialogVisible.value = true
}

const del = async () => {
  try {
    const {data:res} = delPro({
      proId:currentId
    })
    if (res.code === 200){
      ElMessage({
        message:'操作成功!',
        type:'success'
      })
      emits('reloadList')
    } else if (res.code === 201) {
      ElMessage({
        message:res.data.msg,
        type:"warning"
      })
      dialogVisible.value = false
    }
  } catch (e) {
    console.log(e)
  }
}

defineExpose({
  showDel
})
</script>

<style scoped lang="less">
:deep(el-dialog__header){
  padding-top: 6vh !important;
  padding-bottom: 0 !important;
}
:deep(el-dialog__body){
  display: none;
}
:deep(el-overlay-dialog){
  :deep(el-dialog){
    box-sizing: border-box;
    :deep(el-dialog__header){
      padding-top: 6vh !important;
      padding-bottom: 0 !important;
    }
    :deep(el-dialog__body){
      display: none;
    }
  }
}
</style>